<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="theme.css">
    <style>
        /* 选择器优先级：内联样式 > ID 选择器 > 类选择器 > 元素选择器 */
        /* 1. 元素选择器 */
         /*!important 无视优先级规则 */
         p{   /*!important 无视优先级规则 */
            color:blue!important;
        }
        /* 2. 类名选择器，highlight 是绿色 */
        .hightlight{
            color:green;
        }
        /* 3. ID 选择器，p7 是红色 */
        #p7{
            color:pink;
        }
       /* 4. 内联样式  style=... （在 HTML 中）：红色 */
    </style>
</head>
<body>
     
    <p class="hightlight" id="p7" style="color:red;">
        这段文字什么颜色
    </p>
</body>
</html>